<template>
  <div class="app-container" v-if="!pageLoading">
    <qm-workflow
      ref="qmWorkflow"
      keyProp="applyId"
      :rules="rules"
      :showAttachment="false"
    >
      <template v-slot:form="{ model }">
        <el-row :gutter="12">
          <el-col :span="12">
            <el-form-item label="申请人：" prop="model.applyUserName">
              <el-input v-model="model.applyUserName" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="考核对象：" prop="model.userName">
              <el-input v-model="model.userName" disabled></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="12">
          <el-col :span="12">
            <el-form-item label="考核指标：" prop="model.normId">
              <el-cascader
                v-model="model.normId"
                @change="getNormInfo()"
                :options="controlData.norms"
                :show-all-levels="false">
              </el-cascader>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="分数：" prop="model.scores">
              <el-input-number
                class="number-box"
                v-model="model.scores"
                step-strictly
                :step="1"
                :min="scoresMin"
                :max="scoresMax"
                :disabled="scoresDisabled"
              >
              </el-input-number>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="12">
          <el-col :span="12">
            <el-form-item label="考核类型：" prop="model.scoresType">
              <el-select v-model="model.scoresType" disabled>
                <el-option
                  v-for="item in controlData.scoresTypes"
                  :key="item.value"
                  :label="item.key"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="流程类型：" prop="model.normProcessType">
              <el-select v-model="model.normProcessType" disabled>
                <el-option
                  v-for="item in controlData.processTypes"
                  :key="item.value"
                  :label="item.key"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="情况说明：" prop="remark">
              <el-input type="textarea" :rows="2" v-model="model.remark"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </template>
    </qm-workflow>
  </div>
</template>

<script>
  import Controller from "@/libs/framework/workflowController";
  import request from "@/utils/request";

  export default class Instance extends Controller {
    onBeforeInit() {
      this.urls = {
        model: "/eip/kpi/apply/workflow/getWorkflowViewModel",
      };
    }

    onBeforeSave(postModel) {
      postModel.model.normId = postModel.model.normId[1]
      return super.onBeforeSave(postModel);
    }

    mixin() {
      return {
        data() {
          return {
            scoresDisabled: true,
            scoresMin: 0,
            scoresMax: 100,
            rules: {
              model: {
                normId: [{required: true, message: "请选择考核指标", trigger: "blur"}],
                scores: [{required: true, message: "请输入分数", trigger: "blur"}],
                remark: [{required: true, message: "请输入情况说明", trigger: "blur"}],
              }
            }
          }
        },
        methods: {
          getNormInfo() {
            this.models.model.scores = 0;
            this.models.model.scoresType = undefined;
            this.models.model.normProcessType = undefined;
            this.scoresDisabled = false;
            request({
              url: `/eip/kpi/norm/${this.models.model.normId[1]}`,
              method: "get",
            }).then((r) => {
              if (r && !r.initMessage) {
                let norm = r.parameters.norm;
                this.scoresMin = norm.scoresMin;
                this.scoresMax = norm.scoresMax;
                this.models.model.scores = norm.scoresMin;
                this.models.model.scoresType = norm.scoresType;
                this.models.model.normProcessType = norm.processType;
                if (this.scoresMin === this.scoresMax) {
                  this.scoresDisabled = true;
                }
                 //this.controlData.workflow.needChoose = this.models.model.normProcessType !== 'SELF';
              } else {
                reject(r.initMessage || "数据请求失败");
              }
            })
              .catch((e) => {
                reject(e);
              });
          }
        }
      }
    }
  }
</script>

<style scoped>
  .number-box {
    width: 100%
  }
</style>
